A layout approach partitions a plot into a matrix of panels. Each panel shows a different subset of the data.
<!-- Include the CanvasXpress library in your HTML file -->
<link rel="stylesheet" href="https://www.canvasxpress.org/dist/canvasXpress.css" type="text/css"/>
<script src="https://www.canvasxpress.org/canvasXpress.min.js"></script>
<!-- Create a canvas element for the chart with the desired dimensions -->
<div>
<canvas id="canvasId" width="600" height="600"</canvas>
</div>
<!-- Create a script to initialize the chart -->
<script>
<!-- Create the data for the graph -->
var data = {
"y" : {
"data" : [
[76.3,167.6],
[58.6,163.8],
[59.5,160],
[60.3,164.5],
[53.9,162.6],
[78.8,176],
[74.9,172.1],
[62.3,170.2],
[89.6,178],
[59.8,167],
[47.3,152.4],
[102.5,177.8]
],
"smps" : ["Weight","Height"],
"vars" : ["Jax","Finley","Eloise","Elena","Ember","Owen","Ezra","Knox","Mateo","Charlie","Rosalie","Marcus"]
},
"z" : {
"Age" : [35,31,42,23,37,22,25,30,24,20,25,28],
"Chest" : [104.3,85.4,86.7,86.8,72.6,100,100,101.2,108.8,85.9,78,116.7],
"Exercise" : ["Moderate","Intense","Moderate","Intense","Low","Intense","Moderate","Moderate","Moderate","Low","Intense","Intense"],
"Gender" : ["Male","Female","Female","Female","Female","Male","Male","Male","Male","Female","Female","Male"],
"Hair" : ["Blond","Black","Black","Blond","Brown","Brown","Red","Blond","Blond","Brown","Brown","Red"],
"Hip" : [100.4,94,100,93.7,90.2,98,98.4,87.6,106,94.1,87,107.9],
"Waist" : [94.3,68.3,74.7,69.8,58,92,79.7,71.8,89.5,69.1,60.4,113.2]
}
}
<-- Create the configuration for the graph -->
var config = {
"graphType":"Scatter2D",
"histogramBins":"false",
"showTransition":"false",
"theme":"CanvasXpress"
}
<!-- Call the CanvasXpress function to create the graph -->
var cX = new CanvasXpress("canvasId", data, config);
<-- Functions after rendering graph -->
cX.createDOE();
</script>
library(canvasXpress)
y=read.table("https://www.canvasxpress.org/data/cX-body2-dat.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
z=read.table("https://www.canvasxpress.org/data/cX-body2-var.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
canvasXpress(
data=y,
varAnnot=z,
graphType="Scatter2D",
histogramBins=FALSE,
showTransition=FALSE,
theme="CanvasXpress",
afterRender=list(list("createDOE"))
)